
//先导入其他要使用的vue的组件

//创建路由的对象，声明路由的规则
import {createRouter, createWebHistory} from "vue-router";
import Home from "../components/Home.vue";
import List from "../components/List.vue";
import Add from "../components/Add.vue";
import Update from "../components/Update.vue";
import ShowDetail from "../components/ShowDetail.vue";
import ShowDetail2 from "../components/ShowDetail2.vue";
import Login from "../components/Login.vue";

const router = createRouter({
    //createWebHistory 记录历史的页面，能够在页面中实现页面的前进和后退
    history:createWebHistory(),
    //声明路由的地址，实现地址的跳转
    routes:[

        {
            path:'/list',
            component:List
        },
        {
            path:'/add',
            component:Add
        },
        {
            path:'/update',
            component:Update
        },
        {
            path:'/showAll',
            //实现路由的重定向，访问list页面和showAll页面的时候都能够访问到list的页面
            //component:Update
            redirect:'/list'
        },
        {
            //:id:language就是传递的路径的参数
            path:'/showDetail/:id/:language',
            component:ShowDetail
        },
        {
            //使用的是键值对传参的方式
            path:'/showDetail2',
            component:ShowDetail2
        },
        {
            path:'/home',
            component:Home
        },
        {
            path:'/login',
            component:Login
        },
    ]
})
// //执行路由之前的要去调用方法中的回调函数
// router.beforeEach((to,form,next)=>{
//     /*
//     to：去往你设置好的路径
//     form：来自于要去往的路径之前的路径
//     next:放行的方法，直接到达目标的组件
//     neat(/路径)：可以去往其他的路由地址，属于路由的重定向
//      */
//     console.log(to.path,form.path)
//     if (to.path==='/add'){
//         next()
//     }else {
//         next('/list')
//     }
// })
// //执行路由之后的要去调用方法中的回调函数
// router.afterEach((to,form)=>{
//     console.log(`来自于${form.path}去往${to.path}`)
// })

//执行路由之前的要去调用方法中的回调函数
router.beforeEach((to,form,next)=>{
    /*
    to：去往你设置好的路径
    form：来自于要去往的路径之前的路径
    next:放行的方法，直接到达目标的组件
    neat(/路径)：可以去往其他的路由地址，属于路由的重定向
     */
    console.log(to.path,form.path)
    if (to.path==='/login'){
        next()
    }else {
        //let username =window.sessionStorage.getItem('username');
        let username =window.localStorage.getItem('username');
        if(null != username){
            next()
        }else{
            next('/login')
        }
    }
})
//执行路由之后的要去调用方法中的回调函数
router.afterEach((to,form)=>{
    console.log(`来自于${form.path}去往${to.path}`)
})
//暴露对象
export default router;